<template>
	<view>
		<!-- 自定义导航 -->
		<uni-nav-bar left-icon="left"   :statusBar="true" titleSize="30px" leftText="返回" rightText="保存"  title="关联产品"  @clickLeft="back" @clickRight="addBtn" :fixed="true" backgroundColor="#3286ed" color="#fff"/>
	    <!-- 搜索框 -->
		<!-- <u-search    v-model.enter="queryParams.productName" @search="searchFn" @custom="customFn" style="height;40px;background-color: #fff;padding: 10px;margin-bottom: 5px;"   @clear="clearFn" :clearabled="true" showAction  height='30' placeholder="请输入产品名" shape="square" actionText='搜索' @change="searchangeFn"></u-search> -->
	      
			 <uni-table border :stripe="true" type="selection" @selection-change="changeFn" emptyText="暂无更多数据" >
			 	<!-- 表头行 -->
			 	<uni-tr>
			 	    <uni-th align="center" width="100px">产品名称</uni-th>
			 	    <uni-th align="center" width="100px">型号</uni-th>
			 	    <uni-th align="center" width="60px">数量</uni-th>
			        <uni-th align="center" width="60px">日租金</uni-th>
			 	    <uni-th align="center" width="100px">出库数量</uni-th>
			 	    <uni-th align="center" width="100px">未出库数量</uni-th>
			 	    <uni-th align="center" width="100px">回货数量</uni-th>
			 	</uni-tr>
			 	<!-- 表格数据行 -->
			 	<uni-tr v-for="item in stockList" :key="item.id">
			 	    <uni-td align="center">{{item.productName}}</uni-td>
			 	    <uni-td align="center">{{item.model}}</uni-td>
			 	    <uni-td align="center">{{item.quantity}}</uni-td>
			 	    <uni-td align="center">{{item.dailyRent}}</uni-td>
			 	    <uni-td align="center">{{item.deliveryQuantity}}</uni-td>
			 	    <uni-td align="center">{{item.undeliveryQuantity}}</uni-td>
			 	    <uni-td align="center">{{item.returnQuantity}}</uni-td>
			 	</uni-tr>
			 </uni-table>
	</view>
</template>

<script>
	// import {selectProductQuantityList} from '@/api/product/product.js'
	// import {productList} from '@/api/product/product.js'
	// import {} from '@/api/stock.js'
	import {listOrder} from '@/api/order/order.js'
	export default {
		data(){
			return {
				value:'',
				// 查询参数
				      queryParams: {
				        pageNum: 1,
				        pageSize: 100000,
				        productName: null,
				        productNo: null,
				        productId: null,
				        model: null,
				        quantity: null,
				        warehouseId: null,
				        warehouseName: null
				      },
					  stockList:[],//库存表格数据
			          productList:[],//产品型号
			}
		},
		onLoad(e){
			console.log(e);
			if(e.warehouseName=="undefined"){
				this.queryParams.orderNo=''
			}else{
				this.queryParams.orderNo=e.orderNo
			}
			
			
		},
		created() {
			this.getList()
		},
		methods:{
			searchangeFn(){
				 
				this.getList()
			},
			back(){
				uni.navigateBack({
					delta:1
				})
			},
			// 保存
			addBtn(){
				 // 1. 获取当前页面栈实例（此时最后一个元素为当前页）
				let pages = getCurrentPages() 
				console.log(pages);
				 // 2. 上一页面实例
				// 注意是length长度，所以要想得到上一页面的实例需要 -2
				// 若要返回上上页面的实例就 -3，以此类推
			   let prevPage = pages[pages.length -2] 
			   // 3. 给上一页面实例绑定getValue()方法和参数（注意是$vm）
			    prevPage.$vm.getValueS(this.productList) 
				// 4. 返回上一页面
				 uni.navigateBack({
					 delta: 1 // 返回的页面数
				 })
				// uni.navigateTo({
				// 	url:'/pages/order/addOrder/addOrder?productList='+JSON.stringify(this.productList),
					
				// })
			},
			// 输入框清除
			clearFn(){
				this.queryParams.orderNo=''
				this.getList()
			},
			async searchFn(){
				const res=await productList(this.queryParams)
				console.log(res);
				this.getList()
			},
			// 右侧按钮控件
			customFn(e){
				console.log(e);
				if(!this.queryParams.orderNo){
					return false
				}
				this.getList()
			},
			async getList(){
				const res=await listOrder(this.queryParams)
				console.log(res);
				this.stockList=res.rows[0].productList
			},
			changeFn(e){
				console.log(e);
				this.productList=[]
				this.stockList.forEach( (item,index)=>{
					// if(index==e.detail.index){}
					e.detail.index.forEach((val)=>{
						if(val==index){
						console.log(item)
						// item.quantity=''
						this.productList.push(item)
						}
					})
				})
				// console.log(this.productList);
			}
			
			
			
		}
		
	}
</script>

<style lang="scss">
	.redioBox{
		width: 100%;
		min-height: 50px;
		// background-color: #fff;
		margin: 5px;
	}
	.box-list{
		width: 95%;
		min-height: 50px;
		padding: 10px;
		margin: 10px ;
		background-color: #fff;
		.text{
			font-size: 12px;
			margin-top: 3px;
		}
	}
</style>